<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="screen-orientation" content="portrait">
    <meta name="format-detection" content="telephone=no">
    <meta name="browsermode" content="application">
    <meta name="x5-page-mode" content="app">
	 <link rel="stylesheet" type="text/css" href="{__PUBLIC__}h5/css/public.css"/>
    <title>文案复制</title>
    <style>
        body{ max-width: 640px; margin: 0 auto;}
        .copy-pp{ color: #666; line-height: 1.2;}
        .copy-btn{ background-color: cornflowerblue; color: #fff;}
        .copy-text{ opacity: 0;}

		 .btn{display:inline-block;font-family:"微软雅黑";vertical-align:middle;font-weight:400;font-size:9pt;line-height:1.2;padding:9pt;border-radius:2px;cursor:pointer;outline:0;-webkit-appearance:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:background-color .3s ease-out,border-color .3s ease-out;transition:background-color .3s ease-out,border-color .3s ease-out}
		 .am-btn-danger{color:#fff;background-color:#dd514c;border-color:#dd514c}
		 .detail-command-box{border:1px dashed #f60}
		 .am-panel{margin:10px;background-color:#fff;border-radius:0;box-shadow:0 1px 1px rgba(0,0,0,.05)}
		 .am-panel-bd{padding:7px}
		 .kl-tkl{color:#ff6a6a}
		 .detail-command-box textarea{width:100%;height:100%}
		 .am-btn-success{background-color:#02ae69;border-color:#02ae69}
		 .am-btn-default{background-color:#D49700;border-color:#D49700}
		 .detail-command-box textarea{overflow:hidden;border:none;outline:0;resize:none;font-family:Arial,microsoft yahei}
		 </style>
</head>
<body>
<header>
<section class="header" >
     <div class="h-left"><a class="sb-back" href="javascript:history.back(-1)" title="返回"></a></div>
    <div class="h-mid">
    复制淘口令
          </div>
</section></header>

<div class="detail-command-box am-panel">
	<div class="am-panel-bd">

	<div id="copy-pp" class="kl-tkl">
	 点击一键复制淘口令或者长按文本复制淘口令，复制成功后打开手淘APP，可领券并购买【{$biaoti}】!{$taokouling}
	</div>
	<textarea class="kl-tkl" id="copy-text" value="" readonly="readonly"></textarea>
	</div>
	</div>
	<div style="text-align: center;">
		<button type="button" class="btn am-btn am-btn-danger am-round btn-kouling" onclick="jsCopy(this)">一键复制淘口令(记得打开淘宝哦)</button></div>
<!--使用时：请调试到手机模式：-->
<script>
    function jsCopy(obj){
        var u = navigator.userAgent;
        //苹果
        if (u.match(/(iPhone|iPod|iPad);?/i)) {
            var copyDOM = document.getElementById("copy-pp");  //要复制文字的节点
            var range = document.createRange();
            // 选中需要复制的节点
            range.selectNode(copyDOM);
            // 执行选中元素
            window.getSelection().addRange(range);
            // 执行 copy 操作
            var successful = document.execCommand('copy');
            try {
                var msg = successful ? '成功' : '失败';
                console.log(msg);
            } catch(err) {
                console.log(err);
            }
            // 移除选中的元素
            window.getSelection().removeAllRanges();
            obj.innerHTML = '已复制';
			Toast('已复制成功可返回或打开手淘！',5000);
			//setTimeout(history.back(),45000);
        }

        // 安卓
        if(u.indexOf('Android') > -1 ){
            var $copyText = document.getElementById("copy-text"),
                $copyPP = document.getElementById("copy-pp");
            $copyText.innerHTML = $copyPP.innerHTML.replace(/<[^>]+>/g,"");
            $copyText.select(); // 选择对象
            document.execCommand("Copy"); // 执行浏览器复制命令
            obj.innerHTML = '已复制';
			Toast('已复制成功可返回或打开手淘！',5000);
			//setTimeout(history.back(),45000);
        }
        // 安卓系统的UC浏览器
        if(u.indexOf('Android') > -1 && u.indexOf('UCBrowser') > -1){
            obj.innerHTML = '点击复制分享链接';
            alert('若点击复制分享链接无效，请长按内容手动复制！');
        }
    }
	function Toast(msg,duration){
      duration=isNaN(duration)?3000:duration;
      var m = document.createElement('div');
      m.innerHTML = msg;
      m.style.cssText="max-width:60%;min-width: 150px;padding:0 14px;height: 40px;color: rgb(255, 255, 255);line-height: 40px;text-align: center;border-radius: 4px;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 999999;background: rgba(0, 0, 0,.7);font-size: 16px;";
      document.body.appendChild(m);
      setTimeout(function() {
        var d = 0.5;
        m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in';
        m.style.opacity = '0';
        setTimeout(function() { document.body.removeChild(m) }, d * 1000);
      }, duration);
    }
</script>

</body>
</html>